<template>
  <div>
    <h1>充值方式列表</h1>
    <el-table :data="items" :cell-style="{ 'text-align': 'center' }" :header-cell-style="{ 'text-align': 'center' }">
      <el-table-column prop="id" label="ID"></el-table-column>
      <el-table-column prop="title" label="标题"></el-table-column>
      <el-table-column prop="cateLabel" label="类别"></el-table-column>
      <el-table-column fixed="right" label="操作">
        <template slot-scope="scope">
          <el-button type="primary" icon="el-icon-edit" size="mini" @click="$router.push(`/pay/edit/${scope.row.id}`)"
            >编辑</el-button
          >
          <el-button type="danger" icon="el-icon-delete" size="mini" @click="remove(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      items: [],
    };
  },
  methods: {
    async fetch() {
      const { data } = await this.$http.post("/api/payList/get");
      if (data.meta.code === 0) {
        this.items = data.data.payList;
        // console.log(data.data.payList);
      }
    },
    remove(row) {
      this.$confirm(`是否确定要删除该测一测 "${row.title}"`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(async () => {
          const { data } = await this.$http.post("/api/payList/del", { id: row.id });
          if (data.meta.code === 0) {
            this.$message.success("删除成功");
            this.fetch();
          }
        })
        .catch(() => {});
    },
  },
  created() {
    this.fetch();
  },
};
</script>
